<template>
  <div class="container">
    <el-card>
      <img class="logo" src="../../assets/logo.png" alt="">
      <!-- 表单 -->
<!-- <router-view></router-view> -->
<el-form class="el-form" :model="form" :rules="rules" ref="form">
        <el-form-item prop="mobile">
          <el-input v-model="form.mobile" placeholder="请输入手机号"></el-input>
        </el-form-item>
        <el-form-item  prop="code">
          <el-input v-model="form.code" placeholder="请输入密码"></el-input>
        </el-form-item>
        <el-form-item>
          <el-checkbox :value="true">我已阅读并同意「用户协议」和「隐私条款」</el-checkbox>
        </el-form-item>
        <el-form-item>
          <el-button class="el-button" type="primary" @click="login()">登 录</el-button>
        </el-form-item>
      </el-form>
    </el-card>

  </div>
</template>

<script>

export default {
    name: 'IndexDemo',

}
</script>

<style scoped lang="less">
.container {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../../assets/9d09f25348ab5703e918da06422870e.png);
  .el-card {
    width: 440px;
    height: 380px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 50px rgba(0,0,0,0.1);
    .logo {
      width: 200px;
      display: block;
      margin: 0 auto 20px;
    }
    .el-form {
      padding: 0 20px;
      .el-button {
        width: 100%;
      }
    }
  }
}
</style>